
	$("div").not("#butterDiv").attr("contentEditable", "true")

                $("div").css({
                    "outline": "0px solid transparent"
                })
	
	
	$(".butterButton").bind("click", function(){			
		
		state.mousedown = false;

		// the style name variable
		var buttonName = this.id;
		
		var styleName = $(this).data("styleName")	
		var styleValue = $(this).data("styleValue")
		
		var buttonState = butter.buttonState[buttonName];
		
		var onState, offState, buttonValue, buttonState;			
		if(styleValue){
			onState = butter.buttonOnStates[buttonName];
			buttonValue = styleValue;
			
		} else {
			onState = butter.buttonOnStates[styleName];
			offState = butter.buttonOffStates[styleName]	
			buttonValue = butter.button_Match[styleName];
			
		}
	
		
		var range = window.getSelection().getRangeAt(0);	
		
		cloneContents = range.cloneContents();				

		strLen = range.commonAncestorContainer.textContent.length;
		
		selectionLen = range.cloneContents().textContent.length;
		
		if(strLen != selectionLen){
			currentRange = window.getSelection().getRangeAt(0);
			
			if(buttonState == 1 && styleName == "text-decoration"){	
					
					
					textDecorationOff(buttonName,styleValue);
									
			} else {
			
				cloneContents = currentRange.cloneContents();
				startContainer = currentRange.startContainer;
				
				temp = range.extractContents()		
				
				container = document.createElement("span");
				
				$(container).append(temp);	
				
				if(buttonState == 0){
					
					
					butter.buttonState[buttonName] = 1;
					
					setCSS(container, styleName, buttonValue, 1);
				} else {
					
					butter.buttonState[buttonName] = 0;
					
					setCSS(container, styleName, butter.button_MatchOff[styleName], 0);	
				}

					
				if(cloneContents.childNodes & cloneContents.childNodes[0].nodeType == 1){
				
					newR = document.createRange();
					newR.setStartAfter(startContainer.parentNode);
					
					newR.insertNode(container);
				
				} else {
					currentRange.insertNode(container);	
				}	 
				
				
				$(container).find("span").each(function(){
					if(butter.buttonState[buttonName] == 0){	
						if(member1(styleName, $(this).css(styleName),butter.buttonOnStates[buttonName])){
							
							setCSS(this, styleName, butter.button_MatchOff[styleName], 0);	
						}
					} else if (butter.buttonState[buttonName] == 1){
						
						if(member1(styleName, $(this).css(styleName), butter.buttonOffStates[buttonName])){
						
							setCSS(this, styleName, butter.button_Match[styleName], 1);
						}		
					}
				});		
						
						
				var selection = window.getSelection();
				
				sel = window.getSelection();
				sel.removeAllRanges();
				
				newRange = document.createRange();
				newRange.selectNodeContents(container);
				
				sel.addRange(newRange);
			
			}
				
		} else {										
			
			if(buttonState == 1 && styleName == "text-decoration"){	
					
					
					textDecorationOff(buttonName, styleValue);		
									
			} else {
				
				
				
				if(range.commonAncestorContainer.nodeType  == 1){
				
					
				
					if(butter.buttonState[buttonName] == 0){
						butter.buttonState[buttonName] = 1;
						
						
						setCSS(range.commonAncestorContainer, styleName, butter.buttonMatchOn[buttonName], 1)
				
					} else {
						butter.buttonState[buttonName] = 0;
						
						
						
						setCSS(range.commonAncestorContainer, styleName, butter.buttonMatchOff[buttonName], 0)
						
					}
					
					common = range.commonAncestorContainer;	
					
					$(common).find("span").each(function(){
						if(butter.buttonState[buttonName] == 0){	
							if(member1(styleName, $(this).css(styleName), butter.buttonOnStates[buttonName])){
								$(this).css(styleName, butter.button_MatchOff[styleName]);
							}
						} else if (butter.buttonState[buttonName] == 1){
							
							if(member1(styleName, $(this).css(styleName),butter.buttonOffStates[buttonName])){
								$(this).css(styleName, butter.button_Match[styleName]);
							}		
						}
					});	
					
					
					sel = window.getSelection();
					sel.removeAllRanges();
					
					newRange2 = document.createRange();
					newRange2.selectNodeContents(common);
					
					sel.addRange(newRange2);
	
				} else if(range.commonAncestorContainer.nodeType == 3){
					

					
					if(butter.buttonState[buttonName] == 0){
						butter.buttonState[buttonName] = 1;
						$(range.commonAncestorContainer.parentNode).css(styleName, butter.button_Match[styleName]);	
					} else {
						butter.buttonState[buttonName] = 0;
						$(range.commonAncestorContainer.parentNode).css(styleName, butter.button_MatchOff[styleName]);	
					}
					
					common = range.commonAncestorContainer.parentNode;
					
					sel = window.getSelection();
					sel.removeAllRanges();
					
					newRange2 = document.createRange();
					newRange2.selectNodeContents(common);
					
					sel.addRange(newRange2);	
					
					
				}
			}
		}	
		
		if(butter.buttonState[buttonName] == 0){
			
				$(this).find("img").css({
					"border-top": "none",
					"border-right": "none"
				});
	
		} else {
				$(this).find("img").css({
					"border-top": "1px solid black",
					"border-right": "1px solid black"
				})	
		}
		
	});
	
	//Clear and reorganize spans. Smooth things out, delete extra ones
	$(document).bind("click", function(){
		if(window.getSelection() == ''){
			cleanSpans();	
		}	
	});
	
	$("span").bind("mousedown", function(){
		state.mousedown = true;
	});
	
	$(document).bind("mousedown", function(event){
		if(event.target.nodeName != "SPAN"){
			state.mousedown = false;	
		}
	})
	
	
	$(document).bind("mouseup", function(){
		if(state.mousedown == true) {
			checkButtonState();
			
		} else if(window.getSelection() == ''){
			$("#italicButton img").css({
				"border-top": "none",
				"border-right": "none"
			});
		}
	});
	
	$("body").attr("contentEditable", "true");
		

		
		

	
	